<!DOCTYPE html>
<html lang="en" ng-app="myFilter">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/angular-1.3.0.js"></script>
    <style type="text/css">
        .odd{
            color:red;
        }
        .even{
            color: blueviolet;
        }
    </style>
</head>
<body>
<div ng-controller="MyCtrl">
    <input type="text" placeholder="请输入查找的姓名" ng-model="key">
    <ul>
        <li>
            <span>序号</span>
            <span ng-click="title='name';desc = !desc">姓名</span>
            <span ng-click="title='sex';desc = !desc">性别</span>
            <span ng-click="title='age';desc = !desc">年龄</span>
            <span ng-click="title='score';desc = !desc">分数</span>
        </li>
        <li ng-repeat="p in data | filter:{name:key}" ng-class-odd="'odd'" ng-class-even="'even'">
            <span>{{$index + 1}}</span>--<span>{{p.name}}</span>--<span>{{p.sex}}</span>--<span>{{p.age}}</span>--<span>{{p.score}}</span>
        </li>
    </ul>
</div>
<script type="text/javascript">
    var myModule = angular.module("myFilter", []);
    myModule.controller("MyCtrl", ["$scope", function ($scope) {
        $scope.data = [
            {name: "jj", age: 26, score: 80,sex:'男'},
            {name: "zj", age: 24, score: 54,sex:'女'},
            {name: "demo", age: 24, score: 81,sex:'女'},
            {name: "demo2", age: 29, score: 94,sex:'女'}
        ];
        $scope.key='';
    }]);
</script>
</body>
</html>